<template>
  <div class="shenqingXQ" style="margin-left: 15px">
    <p class="shenqing">详细信息
    <el-button type="success" icon="el-icon-finished" size="mini" style="" @click="savePrice">保存</el-button>
    <el-button
        size="mini"
        type="primary"
        icon="el-icon-check"
        @click="cross">保存并通过</el-button>
    <!-- 返回按钮 -->
    <el-button type="primary" icon="el-icon-back" size="mini" @click="goback">返回上一页</el-button>
    </p>
    <table border="1" rules="all" class="tablestyle">
      <tr>
        <td class="nameclass" >申请名称</td>
        <td class="neirongclass">{{queryParams.pickName}}</td>
        <td class="nameclass"  >申请月份</td>
        <td class="neirongclass">{{queryParams.planMonth}}</td>
      </tr>
      <tr>
        <td class="nameclass" >仓库</td>
        <td colspan="3" class="neirongclass">{{queryParams.waName}}</td>

      </tr>
    </table>
    <el-table  :data="queryParams.wzPickingApplyInfos" stripe style="margin-left: 15px;width: 95%;margin-top: 20px"
               border>
      <el-table-column align="center" type="index" label="序号"  width="55"  />
      <el-table-column align="center" label="物料分类" property="typeName"  width="200" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column align="center" label="物料编码" property="mno" :show-overflow-tooltip="true"  ></el-table-column>
      <el-table-column align="center" label="物料名称"  property="mname"  ></el-table-column>
      <el-table-column align="center" label="物料规格"  property="mmodel"  ></el-table-column>
      <el-table-column align="center" label="单位"  property="unit"  ></el-table-column>
      <el-table-column align="center" label="计划价"  property="planPrice"  >
        <template slot-scope="scope">
            <el-input type="number" v-model="scope.row.planPrice" placeholder="" @input="keydownBtn(scope.row)"></el-input>
        </template> 
      </el-table-column>
      <el-table-column align="center" label="未入库数量"  property="storageNum"  ></el-table-column>
      <el-table-column align="center" label="入库数量"  property="demandNum"  >
        <!-- <template slot-scope="scope">
            <el-input type="number" v-model="scope.row.demandNum" placeholder="" @input="xqkeydownBtn(scope.row)"></el-input>
        </template> -->
      </el-table-column>
      <el-table-column align="center" label="用途"  property="useing" :show-overflow-tooltip="true" ></el-table-column>
      <el-table-column align="center" label="备注"  property="note"  :show-overflow-tooltip="true"></el-table-column>
    </el-table>
  </div>
</template>

<script>
  import request from '@/utils/request'
  export default {
    name: "Role",
    data() {
      return {
         //页码信息
        XQpage:undefined,
        XQsize:undefined,
        XQlocal:undefined,
        // 参数
        id:'',
        //审核状态
        storageSteps:'',
        queryParams:{
          pickName:'',
          useing:'',
          planMonth:'',
          note:'',
          teamId:'',
          moneySource:'',
          wzPickingApplyInfos:[]
        },
      };
    },
    created() {
      console.log('接收-采购申请详情',this.$route.query)
      this.id = this.$route.query.pp.row.id
      this.storageSteps = this.$route.query.pp.row.storageSteps
      this.XQpage = this.$route.query.page
      this.XQsize = this.$route.query.size
      this.XQlocal = this.$route.query.xq
      console.log('上一页的路由是',this.XQlocal)
      console.log(this.storageSteps)
      this.search()
    },
    computed:{
      showChange () {
        return this.$route.query.pp.row.storageSteps.storageSteps
      }
    },
    methods: {
      //保存点击
      savePrice () {
        this.$confirm('确认要保存当前数据吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.save()
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消保存'
          });
        });
      },
         //返回
      goback () {
        if(this.XQlocal=='alSP') {
          this.$router.push({path:'/warehouseManagement/althoughSP',query:{page:this.XQpage,size:this.XQsize}});
        }else if(this.XQlocal == 'fiSP') {
          this.$router.push({path:'/warehouseManagement/financialSP',query:{page:this.XQpage,size:this.XQsize}});
        }else if(this.XQlocal == 'puSP') {
          this.$router.push({path:'/warehouseManagement/putInStorageSP',query:{page:this.XQpage,size:this.XQsize}});
        }
         
      },
      //保存
      save () {
        request({
          url:'/material/apply/reviewPutStorage',
          method:'put',
          data:this.queryParams
        }).then(response =>{
          if(response.code==200) {
            this.$message({
              type:'success',
              message:'保存成功'
            })
            // this.$router.go(-1)
            this.goback()
          }
        })
      },
      //判断审核状态通过
      cross () {
        if(this.storageSteps == 1) {
            this.handleDelete(2)
        } else if(this.storageSteps == 2) {
          this.handleDelete(3)
        } else if(this.storageSteps == 3) {
          this.handleDelete(4)
        } else if(this.storageSteps == 4) {
          this.handleDelete(6)
        } 
      },
      //保存并通过
      handleDelete (stoNum) {
        this.$confirm('确认要通过当前数据吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.save()
          console.log(this.id)
          this.tijiaoBtn(this.id,stoNum)
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消通过'
          });
        });
      },
      //通过
      tijiaoBtn:function(row,num){
        request({
          url: '/material/apply/reviewTheStatus',
          method: 'post',
          data: {
            id:row,
            storageSteps:num
          }
        }).then(response => {
          this.$message({
            type: 'success',
            message:response.msg
          });
          this.search()
        });

      },
      //查询
      search:function(){
        var obj={}
        obj.wzPickingApplyId = this.$route.query.pp.row.id
        request({
          url: '/material/apply/putStorageById',
          method: 'get',
          params:obj
        }).then(response => {
          console.log(response)
          this.queryParams = response.data
        });
      },
      //入库数
      // xqkeydownBtn (row) {
      //   if(row.demandNum<0){
      //     row.demandNum=0
      //      this.$message({
      //       type: 'info',
      //       message: '入库数不能为负数'
      //     });
      //   }
      //   if(row.demandNum>row.storageNum) {
      //     row.demandNum = row.storageNum
      //      this.$message({
      //       type: 'info',
      //       message: '入库数量不能大于未入库数量'
      //     });
      //   }
      // },
      //计划价
      keydownBtn (row) {
        if(row.planPrice<0) {
          row.planPrice = 0
          this.$message({
            type: 'info',
            message: '计划价不能为负数'
          });
        }
      }
    }
  };
</script>
<style>
  .shenqingXQ .shenqing{
    color: #05A380;
    font-weight: 700;
    margin-left: 15px;

  }
  .shenqingXQ .tablestyle {
    margin-left: 15px;
    border: 1px solid #cccccc;
    color: #606266;
    font-size: inherit;
    width: 800px;
  }

  .shenqingXQ .fujian span{
    margin-left: 15px;
    cursor: pointer;
  }
  .shenqingXQ .nameclass {
    width: 164px;height: 34px;text-align: center;
  }
  .shenqingXQ .neirongclass {
    padding-left: 16px;
    font-size: 14px;
    width: 220px;
  }
  .shenqingXQ .el-input--small .el-input__inner {
    border: none;
  }
</style>
